<template>
	<view class="container">
		<view style="width: 100%;height: 8vh;"></view>
		<!-- 顶部文本 -->
		<view style="width: 100%;height: 6vh;text-align: center;">
			<span style="font-size: 17px;font-weight: 400;color: rgba(0, 0, 0, 1);">请选择你喜欢的运动类型</span>
		</view>
		<view style="width: 100%;height: 5vh;"></view>
		<!-- 运动类型标签 -->
		<view style="width: 65%;height: 40vh;margin: 0 auto;margin-left: 16%;">
			<view
				style="width: 43%; height: 6vh; float: left; border-radius: 20px; text-align: center; margin-top: 10%; margin-left: 5%;"
				v-for="item in FitnessPurposeList"
				:style="{ 'border': item.selected ? '2px solid blue' : '2px solid rgba(217, 217, 217, 1)' }"
				@click="toggleSportType(item)">
				<span
					:style="{ 'line-height': '6vh', 'color': item.selected ? 'blue' : 'black' }">{{item.fitnessPurposeName}}</span>
			</view>
		</view>
		<view style="width: 100%;height: 18vh;"></view>
		<view style="width: 70%;height: 6vh;margin: 0 auto;">
			<view
				style="width: 40%;height: 100%;float: left;border: 2px solid rgba(227, 227, 227, 1);border-radius: 48px;text-align: center;">
				<span style="font-size: 20px;color: rgba(133, 133, 133, 1);font-weight: 400;line-height: 6vh;">保密</span>
			</view>
			<view @click="goWelcome()"
				style="width: 40%;height: 100%;float: right;background: linear-gradient(90deg, rgba(146, 163, 253, 1) 0%, rgba(157, 206, 255, 1) 100%);border-radius: 48px;text-align: center;">
				<span style="font-size: 20px;color: rgba(255, 255, 255, 1);font-weight: 400;line-height: 6vh;">确定</span>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				boy: 0,
				zongreliang: 0,
				reliang: 0,
				fitnessPlanAction: {
					fitnessPlanId: 0,
					fitnessActionId: 0,
					fitnessActionCountAll: 0,
					fitnessActionExpend: 0,
				},
				items: {},
				userInfo: {},
				fitnessPlan: {
					venueUniqueIdentifier: "",
					fitnessPlanName: "",
					memberId: 0,
					coachId: 0,
					fitnessPurposeId: 0
				},
				fitnessPurposeId: 0,
				FitnessPurposeList: []
			}
		},
		mounted() {
			this.userInfo = uni.getStorageSync('userInfo')
			this.indexAll()
			uni.request({
				url: "http://127.0.0.1:17000/memberUser/updateMemberByIds",
				method: "POST",
				data: this.userInfo,
				success: (res) => {
					if (res.data.code == 200) {}
				}
			})
		},
		methods: {
			toggleSportType(item) {
				console.log(item)
				this.fitnessPurposeId = item.id
				uni.setStorageSync('item', item)
				// 切换选定状态
				item.selected = !item.selected;
				// 根据选定状态设置样式
				const index = this.FitnessPurposeList.indexOf(item);
				if (item.selected) {
					// 选中时的样式
					this.$set(this.FitnessPurposeList, index, {
						...item,
						selected: true,
						style: 'color: blue; border: 2px solid blue;'
					});
				} else {
					// 未选中时的样式
					this.$set(this.FitnessPurposeList, index, {
						...item,
						selected: false,
						style: 'color: black; border: 2px solid rgba(217, 217, 217, 1);'
					});
				}
			},
			indexAll() {
				uni.request({
					url: "http://127.0.0.1:17000/plan/getFitnessPurpose",
					method: "GET",
					data: {
						venueUniqueIdentifier: "2f56c0ce-98f0-4a80-bd8e-85dfbec02ee9",
					},
					success: (res) => {
						if (res.data.code == 200) {
							this.FitnessPurposeList = res.data.data.content;
							// 为每个元素添加selected属性，初始值为false
							this.FitnessPurposeList.forEach(item => {
								item.selected = false;
							});
							console.log(this.FitnessPurposeList)
						}
					}
				})
			},
			queryAll() {
				this.fitnessPlanAction;
				this.items = uni.getStorageSync('item');
				// 查询 "热身" 类型的健身动作
				uni.request({
					url: "http://127.0.0.1:17000/plan/queryFitnessAction",
					method: "GET",
					data: {
						venueUniqueIdentifier: "2f56c0ce-98f0-4a80-bd8e-85dfbec02ee9",
						fitnessPurposeId: this.items.id,
						fitnessTypeName: "热身"
					},
					success: (res) => {
						this.fitnessPlanAction.fitnessPlanId = uni.getStorageSync('planId');
						this.fitnessPlanAction.fitnessActionId = res.data.data.data[0].id;
						uni.request({
							url: "http://127.0.0.1:17000/plan/addFitnessPlanAction",
							method: "POST",
							data: this.fitnessPlanAction,
							success: (res) => {}
						})
					}
				});

				// 调用递归函数
				this.queryFitnessActionRecursive();
				// 查询 "放松" 类型的健身动作
				uni.request({
					url: "http://127.0.0.1:17000/plan/queryFitnessAction",
					method: "GET",
					data: {
						venueUniqueIdentifier: "2f56c0ce-98f0-4a80-bd8e-85dfbec02ee9",
						fitnessPurposeId: this.items.id,
						fitnessTypeName: "放松"
					},
					success: (res) => {
						this.fitnessPlanAction.fitnessPlanId = uni.getStorageSync('planId');
						this.fitnessPlanAction.fitnessActionId = res.data.data.data[0].id;
						this.fitnessPlanAction.fitnessActionExpend = 0;
						uni.request({
							url: "http://127.0.0.1:17000/plan/addFitnessPlanAction",
							method: "POST",
							data: this.fitnessPlanAction,
							success: (res) => {
								uni.navigateTo({
									url: '/pages/student/chooseLabel/welcome',
									animationType: 'slide-out-top',
									animationDuration: 200
								});
							}
						})
					}
				});
			},

			queryFitnessActionRecursive() {
				uni.request({
					url: "http://127.0.0.1:17000/plan/queryFitnessAction",
					method: "GET",
					data: {
						venueUniqueIdentifier: "2f56c0ce-98f0-4a80-bd8e-85dfbec02ee9",
						fitnessPurposeId: this.items.id,
						fitnessTypeName: "训练"
					},
					success: (res) => {
						this.fitnessPlanAction.fitnessPlanId = uni.getStorageSync('planId');
						this.fitnessPlanAction.fitnessActionId = res.data.data.data[0].id;
						this.reliang = parseFloat(res.data.data.data[0].fitnessActionConsumption) * parseInt(
							this.userInfo.memberUserWeight);
						if(this.reliang<100){
							this.reliang = Math.round(this.reliang / 10) * 10;
						}else{
							this.reliang = Math.round(this.reliang / 100) * 100;
						}
						
						this.fitnessPlanAction.fitnessActionExpend = this.reliang;
						console.log(this.reliang);
						// 追加逻辑，比如发起请求或添加计划
						uni.request({
							url: "http://127.0.0.1:17000/plan/addFitnessPlanAction",
							method: "POST",
							data: this.fitnessPlanAction,
							success: (res) => {}
						});
						// 将 this.reliang 的值累加到 this.zongreliang 中
						this.zongreliang += this.reliang;
						console.log(this.zongreliang);
						// 检查 this.reliang 是否大于 1300
						if (this.zongreliang <= this.boy) {
							// 继续递归调用
							this.queryFitnessActionRecursive();
						}
					}
				});
			},
			goWelcome() {
				uni.request({
					url: "http://127.0.0.1:17000/plan/selectPlanById",
					method: "get",
					data: {
						memberId: this.userInfo.id
					},
					success: (res) => {
						if (res.data.code == 200) {
							console.log(res.data.data.data==null)
							if (res.data.data.data!=null) {
								uni.showToast({
									title: '已有计划',
									icon: 'none',
									duration: 2000
								})
								uni.navigateTo({
									url: '/pages/student/chooseLabel/welcome',
									animationType: 'slide-out-top',
									animationDuration: 200
								})
							} else {
								this.boy = Math.round(5 * 7700 / 30);
								this.boy = Math.round(this.boy / 100) * 100
								console.log(Math.round(this.boy / 100) * 100)
								this.items = uni.getStorageSync('item');
								console.log(this.items);
								this.fitnessPlan.fitnessPlanName = this.userInfo.memberUserRealName + this.items.fitnessPurposeName + "计划";
								this.fitnessPlan.venueUniqueIdentifier = this.userInfo.venueUniqueIdentifier;
								this.fitnessPlan.coachId = uni.getStorageSync('coach');
								this.fitnessPlan.memberId = this.userInfo.id;
								this.fitnessPlan.fitnessPurposeId = this.items.id;
								uni.request({
									url: "http://127.0.0.1:17000/plan/addFitnessPlan",
									method: "POST",
									data: this.fitnessPlan,
									success: (res) => {
										if (res.data.code === 200) {
											uni.setStorageSync('planId', res.data.data.data)
											this.queryAll()
											// uni.navigateTo({
											//     url: '/pages/student/chooseLabel/welcome',
											//     animationType: 'slide-out-top',
											//     animationDuration: 200
											// });
										}
									}
								});
							}
						}
					}
				})
				// 66 + (13.7 * this.userInfo.memberUserWeight) + (5 * this.userInfo.memberUserHeight) - (6.8 * this.userInfo.memberUserAge);
				
			},
		}
	}
</script>

<style>
	.selected {
		background-color: lightblue;
		/* 选中时的背景颜色 */
	}

	/* 设置背景图片 */
	.container {
		/* display: flex; */
		justify-content: center;
		align-items: center;
		height: 100vh;
		/* background: blue; */
		/* background-image: url("https://img.js.design/assets/img/625aea28bd06c1a5e27ed094.png"); */
		/* background-size: cover; */
	}

	.img1 {
		width: 100%;
		height: 100%;
	}
</style>